<template>
	<el-select v-model="userId" v-bind="selectConfig" :disabled="disabled" :remote-method="handleRemoteMethod" :loading="selectLoading">
		<el-option v-for="(item, index) in userList" :key="index" :label="item.name" :value="item.userId"></el-option>
	</el-select>
</template>

<script>
import emitter from 'element-ui/src/mixins/emitter';
import { listUser, getUser } from '@/api/personnal/person';
export default {
	mixins: [emitter],
	props: {
		value: [Number, String],
		list: { type: Array, default: () => [] },
		disabled: { type: Boolean, default: false }
	},
	data() {
		return {
			userId: this.value,
			userList: [],
			selectLoading: false,
			selectConfig: {
				remote: true,
				multiple: false,
				filterable: true,
				reserveKeyword: true,
				style: { width: '100%' },
				placeholder: '输入人员关键词'
			}
		};
	},
	watch: {
		value(id) {
			this.userId = !id ? null : Number(id);
		},
		userId(id) {
			this.$emit('input', id);
			this.dispatch('ElFormItem', 'el.form.change', [id]);
		},
		list(arr) {
			this.userList = [...arr];
		}
	},
	methods: {
		//获取涉密人员
		async getUserList(data) {
			let params = { pageNum: 1, pageSize: 96, ...data };
			let result = await listUser(params);
			this.selectLoading = false;
			if (result.code === 200) {
				this.userList = result.rows || [];
			}
		},

		//查询涉密人员
		handleRemoteMethod(name) {
			this.selectLoading = true;
			this.getUserList({ name });
		}
	}
};
</script>

<style scoped></style>
